//引入刚才下载的vue-router
import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router';
// 定义路由配置

// 使用es6的模块化的导入导出.引入对应的路由组件
// import Home from '../views/HomeView.vue';
// import Category from '../views/CategoryView.vue'
// import Car from '../views/CarView.vue'
// import Mine from '../views/mine/MineView.vue';
// import Mine1 from '../views/mine/MineView1.vue';
// import Mine2 from '../views/mine/MineView2.vue';
// import Login from '../views/LoginView.vue';
// import Detail from '../views/DetailView.vue';
// import NotFound from '../views/NotFoundView.vue';

// 第一步:定义路由的匹配对应规则
const routes = [
    { path: '/', redirect: '/home' }, // 路由重定向,一般放在路由规则的最上方
    { path: '/home', component: () => import('../views/HomeView.vue'), name: 'home', meta: { title: '首页', isshow: true } },
    { path: '/category', component: () => import('../views/CategoryView.vue'), name: 'category', meta: { title: '分类', isshow: true } },
    { path: '/car/:id?/:id1?', component: () => import('../views/CarView.vue'), name: 'car', props: true, meta: { title: '购物车', isshow: true } },
    { path: '/login', component: () => import('../views/LoginView.vue'), name: 'login', meta: { title: '登录页', isshow: false } },
    { path: '/detail/:id', component: () => import('../views/DetailView.vue'), name: 'detail', meta: { title: '商品详情', isshow: false } },
    {
        path: '/mine',
        component: () => import('../views/mine/MineView.vue'),
        name: 'mine',
        beforeEnter: (to, from) => {
            // console.log('路由独享守卫', to, from);
            if (from.path.includes('/car')) {
                console.log('car');
                return false
            }
        },
        meta: { title: '我的', isshow: true },
        children: [
            {
                path: '', // 默认路由
                name: 'mine1',
                component: () => import('../views/mine/MineView1.vue')
            },
            {
                path: '/mine/mine2',
                name: 'mine2',
                component: () => import('../views/mine/MineView2.vue')
            }
        ]
    },
    { path: '/:pathMatch(.*)*', name: 'NotFound', component: () => import('../views/NotFoundView.vue') },
];

//第二步: 创建路由对象
const router = createRouter({
    history: createWebHistory(), // 设置当前的路由模式为hash模式
    routes  //将路由规则传给路由对象
});

//第三步: 将创建好的路由对象 router 抛出去

// 定义全局前置守卫
router.beforeEach((to, from) => {
    // to 表示下一个路由对象
    // from : 表示上一个路由对象
    // return false
    // 
    // console.log('路由守卫');
    // console.log(from);
    // console.log(to);
    if (to.path != '/login') {
        // 判断当前本地有没有token .有的话,表示已经登录了,否则没有登录
        if (!localStorage.getItem('token')) {
            // 没有token, 让其跳到登录页重新登录
            return { path: '/login' }

        }

        // console.log(1, to.path);
        // 将上次的非登录页的地址存起来
        localStorage.setItem('path', to.path)
    } else {
        // 当跳转到登录页时候,判断当前用是否登录过,如果有token ,提示已登录,无需重复登录
        // console.log(2, from.path);
        if (localStorage.getItem('token')) {
            alert('已登录.不需要重复登录!!')
            // console.log(from);
            return {
                path: localStorage.getItem('path') // 返回到上次的非登录页
            }
        }
    }

})

// 全局后置钩子函数
router.afterEach((to, from) => {
    //注意:此时已经进入到了新的导航地址,无法更改导航地址,为时已晚
    // console.log('afterEach', to);
    // 修改页面的标题信息
    document.title = to.meta.title
})




// 默认导出
export default router

